<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorator="page">
<body>
<div th:fragment="pagin">
    <div class="text-right" style="margin-top: 20px;"
         th:with="baseUrl=${#httpServletRequest.getRequestURL().toString()},
         pars=${#httpServletRequest.getQueryString() eq null ? '' : new String(#httpServletRequest.getQueryString().getBytes('iso8859-1'), 'UTF-8')}">

        <ul style="margin:0;" class="pagination"
            th:with="newPar=${new String(pars eq null ? '' : pars).replace('page='+(data.number), '')},
                         curTmpUrl=${baseUrl+'?'+newPar},
                         curUrl=${curTmpUrl.endsWith('&') ? curTmpUrl.substring(0, curTmpUrl.length()-1):curTmpUrl}">
            <li>
                <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page = 0)} + '\')'">
                    首页
                </a>
            </li>
            <li th:if="${data.hasPrevious()}">
                <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page = ${data.number - 1})} + '\')'">
                    上一页
                </a>
            </li>

            <!--总页数小于等于10-->
            <div th:if="${(data.totalPages le 10) and (data.totalPages gt 0)}" th:remove="tag">
                <div th:each="pg : ${#numbers.sequence(0, data.totalPages - 1)}" th:remove="tag">
                        <span th:if="${pg eq data.getNumber()}" th:remove="tag">
                            <li class="active"><span class="current_page line_height" th:text="${pg+1}">${pageNumber}</span></li>
                        </span>
                    <span th:unless="${pg eq data.getNumber()}" th:remove="tag">
                            <li><a href="#" th:text="${pg+1}" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${pg})} + '\')'"></a></li>
                        </span>
                </div>
            </div>

            <!--总数数大于10时-->
            <div th:if="${data.totalPages gt 10}" th:remove="tag">
                <li th:if="${data.number-2 ge 0}">
                    <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${data.number}-2)} + '\')'" th:text="${data.number-1}"></a>
                </li>
                <li th:if="${data.number-1 ge 0}">
                    <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${data.number}-1)} + '\')'" th:text="${data.number}"></a>
                </li>
                <li class="active"><span class="current_page line_height" th:text="${datas.number+1}"></span></li>
                <li th:if="${data.number+1 lt data.totalPages}">
                    <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${data.number}+1)} + '\')'" th:text="${data.number+2}"></a>
                </li>
                <li th:if="${data.number+2 lt data.totalPages}">
                    <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${data.number}+2)} + '\')'" th:text="${data.number+3}"></a>
                </li>
            </div>

            <li th:if="${data.hasNext()}">
                <a href="#" th:onclick="'javascript:loadData(\'' + @{${curUrl}(page=${data.number+1})} + '\')'">
                    下一页
                </a>
            </li>
            <li>
                <a href="#" th:onclick="'javascript:loadData(\'' + ${data.totalPages le 0 ? curUrl+'page=0':curUrl+'&page='+(data.totalPages-1)} + '\')'">
                    尾页
                </a>
            </li>
            <li><span th:utext="'共'+${data.totalPages}+'页 / '+${data.totalElements}+' 条'"></span></li>
        </ul>
    </div>
    <script th:inline="javascript">
        function loadData(url) {
            $("#main-page").load(url); }
    </script>
</div>
</body>
</html>